<script setup lang="ts">
/**
 * text: 文本
 * color:字体颜色
 * back:背景颜色
 * url:跳转的路径
 *  */
const props = defineProps({
    text:String,
    color:String,
    back:String,
    url:String,
})

const router = useRouter()

function goToFunc(){
    router.push(props.url)
}
</script>

<template>
    <div class="box1All" :style="{background:props.back,color:props.color}" @click="goToFunc">
        <span>{{ props.text }}</span>
    </div>
</template>

<style scoped>
.box1All{
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    cursor: pointer;
}
</style>